<template>
    <rx-layout>
        <div slot="center">
            <a-form-model layout="vertical" >
                <a-form-model-item :label="i18n('link','链接')">
                    <div><span style="color: grey">{{i18n('onlyMember','仅限内部成员登录系统后访问')}}</span></div>
                    <div style="margin-top: 10px;">
                        <a-input v-model="url" :disabled="true" style="width: 80%;margin-right: 15px;">
                            <my-icon slot="addonAfter" type="iconsend" :title="i18n('openWindow','新窗口打开')" @click="openNew"></my-icon>
                        </a-input>
                        <a-button @click="copyUrl">{{i18n('copy','复制')}}</a-button>
                    </div>
                </a-form-model-item>
<!--                <a-form-model-item label="对外公开分享">-->
<!--                    <a-switch v-model="publicity" @change="publicityChange"/>-->
<!--                </a-form-model-item>-->
            </a-form-model>
        </div>
    </rx-layout>
</template>

<script>
/**
 * 页面定制分享
 */
import {RxLayout,Util,App} from "@lowcode/jpaas-common-lib";
import FormApi from "@/views/modules/form/core/js-comps/api/FormApi.js";
import {
    mapState
} from 'vuex';

export default {
    name: "FormCustomShare",
    props:["formCustom"],
    mixins:[App],
    components: {
        RxLayout,
    },
    computed: {
        ...mapState({
            user: state => state.appSetting.user,
        })
    },
    data() {
        return {
            url:"",
            serverAddress:"",
            publicity:false
        }
    },
    created() {
        this.getServerAddress();
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "formComponent", key);
        },
        getServerAddress(){
            FormApi.getServerAddress().then(res => {
                this.serverAddress = res.serverAddress;
                this.init();
            });
        },
        init(){
            if(this.formCustom){
                var url="/FormCustomShare/";
                var paramStr=this.encryParam();
                this.url = this.serverAddress+url+paramStr;
            }
        },
        /**
         * 加密参数
         * @returns {string}
         */
        encryParam(){
            var paramStr="";
            var  params={
                alias:this.formCustom.alias,
                publicity:this.publicity,
                userId:this.user.userId
            }
            paramStr = window.encodeURIComponent(JSON.stringify(params));
            return window.btoa(paramStr)+'?appId='+this.curApp.appId; // 编码
        },
        copyUrl(){
            let tag = document.createElement('input');
            tag.setAttribute('id', 'copyInput');
            tag.value = this.url;
            document.getElementsByTagName('body')[0].appendChild(tag);
            document.getElementById('copyInput').select();
            document.execCommand('copy');
            document.getElementById('copyInput').remove();
            this.$message.success(this.i18n('msg.copyTips','复制成功!'));
        },
        openNew(){
            window.open(this.url);
        },
        publicityChange(){
            this.init();
        }

    },
    watch: {}
}
</script>

<style scoped>
</style>